<template>
    <div>
        <div class="crumbs">
            <div class="contentbox">
                <div class="contentsize">数据归档-其他合同归档</div>
                <div>
                    <el-button @click="cacelsubmitForm('ruleForm')">返回</el-button>
                </div>
            </div>
        </div>
        <div class="container">
            <div style="width: 90%; margin: auto">
                <table class="table-1">
                    <tr>
                        <td colspan="4" style="font-weight: 700; padding: 10px; font-size: 20px">其他合同</td>
                    </tr>
                </table>
                <table class="table-1" v-for="(adlistitem, index) in projectdetail.buildList" :key="index">
                    <!-- 三行三列的表格 -->
                    <tr style="background-color: #f6eed9">
                        <td style="text-align: right; font-weight: 700; color: #000; width: 300px">房屋地址:</td>
                        <td colspan="3">
                            {{ adlistitem.fwdz }}
                        </td>
                    </tr>
                </table>
                <table class="table-1" style="margin-top: 10px">
                    <!-- 三行三列的表格 -->
                    <tr>
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">合同名称:</td>
                        <td style="width: 298.59px">
                            {{ projectdetail.htmc }}
                        </td>
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">合同类型:</td>
                        <td style="width: 298.59px">
                            {{ projectdetail.htlx }}
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">甲方:</td>
                        <td colspan="3">
                            {{ projectdetail.jf }}
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">乙方:</td>
                        <td colspan="3">
                            {{ projectdetail.yf }}
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">丙方:</td>
                        <td colspan="3">
                            {{ projectdetail.bf }}
                        </td>
                    </tr>
                    <tr style="background-color: #f5fafa">
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">收支情况:</td>
                        <td style="width: 298.59px">
                            {{ projectdetail.szqk }}
                        </td>
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">合同金额:</td>
                        <td style="width: 298.59px">
                            {{ projectdetail.htje }}
                        </td>
                    </tr>
                    <tr>
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">合同起始时间:</td>
                        <td style="width: 298.59px">
                            {{ projectdetail.htqssj ? projectdetail.htqssj.split(' ')[0] : '' }}
                        </td>
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">合同到期时间:</td>
                        <td style="width: 298.59px">
                            {{ projectdetail.htdqsj ? projectdetail.htdqsj.split(' ')[0] : '' }}
                        </td>
                    </tr>
                    <tr style="background-color: #f5fafa">
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">合同签订时间:</td>
                        <td style="width: 298.59px">
                            <el-date-picker
                                type="date"
                                placeholder="选择合同签订时间"
                                v-model="projectdetail.htqdsj"
                                style="width: 100%"
                                value-format="yyyy-MM-dd"
                                :disabled="detailform.isstartend != 1"
                            ></el-date-picker>
                        </td>
                        <td style="text-align: right; width: 126.91px; font-weight: 700; color: #000">合同编号:</td>
                        <td style="width: 298.59px">
                            <el-input
                                v-model="projectdetail.htbh"
                                placeholder="请输入合同编号"
                                class="search-input"
                                :disabled="detailform.isstartend != 1"
                            ></el-input>
                        </td>
                    </tr>
                    <tr style="background-color: #f5fafa">
                        <td style="text-align: right; font-weight: 700; color: #000">中心党委会纪要编号:</td>
                        <td colspan="3">
                            {{ projectdetail.jybh ? projectdetail.jybh : '' }}
                        </td>
                    </tr>
                    <tr style="background-color: #f5fafa" v-if="projectdetail.htje > 6000">
                        <td style="text-align: right; font-weight: 700; color: #000">采购申请单:</td>
                        <td colspan="3">
                            <el-table :data="yjhttableData" style="width: 100%" border max-height="150">
                                <el-table-column prop="name" label="文件名称" align="center" :show-overflow-tooltip="true">
                                </el-table-column>
                                <el-table-column prop="name" label="文件预览" align="center" :show-overflow-tooltip="true">
                                    <template slot-scope="scope">
                                        <router-link
                                            target="_blank"
                                            :to="{ path: '/perviewfile', query: { id: scope.row.id, type: scope.row.suffix } }"
                                            style="color: #008a94"
                                            v-if="
                                                scope.row.suffix == '.docx' ||
                                                scope.row.suffix == '.doc' ||
                                                scope.row.suffix == '.xls' ||
                                                scope.row.suffix == '.xlsx'
                                            "
                                            >{{ scope.row.name }}<i class="el-icon-document el-icon--right"></i>
                                        </router-link>
                                        <el-button
                                            type="text"
                                            size="small"
                                            @click="redownload(scope.row.id, scope.row.name, scope.row.suffix)"
                                            v-else
                                            >{{ scope.row.name }}<i class="el-icon-document el-icon--right"></i
                                        ></el-button>
                                    </template>
                                </el-table-column>
                                <el-table-column prop="name" label="文件下载" align="center" :show-overflow-tooltip="true">
                                    <template slot-scope="scope">
                                        <el-button
                                            type="text"
                                            size="small"
                                            @click="downloadfile(scope.row.id, scope.row.name, scope.row.suffix)"
                                            style="color: blue; text-decoration: underline"
                                            >{{ scope.row.name }}</el-button
                                        >
                                    </template>
                                </el-table-column>
                            </el-table>
                        </td>
                    </tr>
                    <!-- <tr style="background-color: #F5FAFA;">
                        <td style="text-align: right;font-weight: 700;color: #000;">办件事由:</td>
                        <td colspan="3">
                            {{ projectdetail.bjsy }}
                        </td>
                    </tr> -->
                    <!-- <tr>
                        <td colspan="4">
                            <el-table :data="filetable" style="width: 100%;" border max-height="150">
                                <el-table-column prop="yjbz" label="文件名称" align="center"> </el-table-column>
                                <el-table-column prop="yjlx" label="文件类型" align="center"> </el-table-column>
                                <el-table-column prop="wjmc" label="文件预览" align="center">
                                    <template slot-scope="scope">
                                        <router-link target="_blank"
                                            :to="{ path: '/perviewfile', query: { id: scope.row.fj[0].id, type: scope.row.fj[0].suffix } }"
                                            style="color: #008A94;"
                                            v-if="scope.row.fj[0].suffix == '.docx' || scope.row.fj[0].suffix == '.doc' || scope.row.fj[0].suffix == '.xls' || scope.row.fj[0].suffix == '.xlsx'">{{
                        scope.row.wjmc }}<i class="el-icon-document el-icon--right"></i>
                                        </router-link>
                                        <el-button type="text" size="small"
                                            @click="redownload(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                            v-else>{{ scope.row.wjmc }}<i
                                                class="el-icon-document el-icon--right"></i></el-button>
                                    </template>
                                </el-table-column>
                                <el-table-column prop="wjmc" label="文件下载" align="center">

                                    <template slot-scope="scope">
                                        <el-button type="text" size="small"
                                            @click="downloadfile(scope.row.fj[0].id, scope.row.fj[0].name, scope.row.fj[0].suffix)"
                                            style="color: blue;text-decoration: underline">{{ scope.row.wjmc
                                            }}</el-button>
                                    </template>
                                </el-table-column>
                                <el-table-column prop="sfgz" label="是否需要盖章" align="center"> </el-table-column>
                                <el-table-column prop="gzlx" label="盖章类型" align="center"> </el-table-column>

                            </el-table>
                        </td>
                    </tr> -->
                </table>
            </div>
            <el-tabs v-model="activeName" @tab-click="handleClick" style="width: 90%; margin: auto; margin-top: 30px">
                <el-tab-pane label="通过" name="first">
                    <span slot="label" style="font-size: 16px">
                        <i style="margin: 0 10px 0 10px">
                            <span style="padding-left: 8px; font-weight: bold; font-style: normal">通过</span>
                        </i>
                    </span>
                    <table class="table-1">
                        <tr>
                            <td style="text-align: right; font-weight: 700; color: #000">当前环节:</td>
                            <td colspan="3" style="text-align: left">{{ detailform.bz }}</td>
                        </tr>
                        <tr style="background-color: #f5fafa">
                            <td style="text-align: right; font-weight: 700; color: #000">步骤:</td>
                            <td colspan="3" style="text-align: left">
                                <el-radio-group v-model="form.nextnodeid" v-if="detailform.ishq == 0">
                                    <el-radio
                                        :label="item.id"
                                        v-for="(item, index) in detailform.nextnodelist"
                                        :key="index"
                                        @change="getry(item)"
                                        >{{ item.bz }}</el-radio
                                    >
                                </el-radio-group>
                                <!-- 多选控制只能选一个操作 -->
                                <el-checkbox-group v-model="options" v-else>
                                    <el-checkbox
                                        :label="item.id"
                                        v-for="(item, index) in detailform.nextnodelist"
                                        :key="index"
                                        @change="searchChangeitem(item)"
                                        >{{ item.bz }}</el-checkbox
                                    >
                                </el-checkbox-group>
                            </td>
                        </tr>
                        <tr v-if="detailform.ishq == 0">
                            <td style="text-align: right; font-weight: 700; color: #000">选择人员:</td>
                            <td colspan="3" style="text-align: left">
                                <el-radio-group v-model="form.selectuser">
                                    <el-radio :label="item.id" v-for="(item, index) in userlist" :key="index">{{ item.name }}</el-radio>
                                </el-radio-group>
                            </td>
                        </tr>
                        <tr>
                            <td style="text-align: right; font-weight: 700; color: #000">意见:</td>
                            <td colspan="3">
                                <div style="display: flex; justify-content: space-between">
                                    <div style="width: 48%">
                                        <el-input type="textarea" :autosize="{ minRows: 5 }" placeholder="请输入内容" v-model="form.clyj">
                                        </el-input>
                                    </div>
                                    <div class="xzyj" v-if="role == '10013'">
                                        <div
                                            v-for="(item, index) in yjlistld"
                                            :key="index"
                                            class="xzyjitem"
                                            :style="yjdeepcolor == index ? 'background-color:#CECECE;' : ''"
                                            @click="getYjVal(item, index)"
                                        >
                                            {{ item }}
                                        </div>
                                    </div>
                                    <div class="xzyj" v-else-if="role == '10010'">
                                        <div
                                            v-for="(item, index) in yjlistnq"
                                            :key="index"
                                            class="xzyjitem"
                                            :style="yjdeepcolor == index ? 'background-color:#CECECE;' : ''"
                                            @click="getYjVal(item, index)"
                                        >
                                            {{ item }}
                                        </div>
                                    </div>
                                    <div class="xzyj" v-else>
                                        <div
                                            v-for="(item, index) in yjlist"
                                            :key="index"
                                            class="xzyjitem"
                                            :style="yjdeepcolor == index ? 'background-color:#CECECE;' : ''"
                                            @click="getYjVal(item, index)"
                                        >
                                            {{ item }}
                                        </div>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        <tr style="background-color: #f5fafa">
                            <td colspan="4">
                                <el-button size="mini" type="primary" @click="nextstep" :disabled="isSubmit">通过</el-button>
                                <el-button size="mini" @click="cacelsubmitForm('ruleForm')">返回</el-button>
                            </td>
                        </tr>
                    </table>
                </el-tab-pane>
                <el-tab-pane label="回退" name="second" :disabled="detailform.isth == 0">
                    <span slot="label" style="font-size: 16px">
                        <i style="margin: 0 10px 0 10px">
                            <span style="padding-left: 8px; font-weight: bold; font-style: normal; color: red">回退</span>
                        </i>
                    </span>
                    <table class="table-1">
                        <tr>
                            <td style="text-align: right; font-weight: 700; color: #000">当前环节:</td>
                            <td colspan="3" style="text-align: left">{{ detailform.bz }}</td>
                        </tr>
                        <tr style="background-color: #f5fafa">
                            <td style="text-align: right; font-weight: 700; color: #000">步骤:</td>
                            <td colspan="3" style="text-align: left">
                                <el-radio-group v-model="form.nextnodeid">
                                    <el-radio
                                        :label="item.id"
                                        v-for="(item, index) in detailform.lastnodelist"
                                        :key="index"
                                        @change="getryht(item)"
                                        >{{ item.bz }}</el-radio
                                    >
                                </el-radio-group>
                            </td>
                        </tr>
                        <tr>
                            <td style="text-align: right; font-weight: 700; color: #000">选择人员:</td>
                            <td colspan="3" style="text-align: left">
                                <el-radio-group v-model="form.selectuser">
                                    <el-radio :label="item.id" v-for="(item, index) in userlistht" :key="index">{{ item.name }}</el-radio>
                                </el-radio-group>
                            </td>
                        </tr>
                        <tr>
                            <td style="text-align: right; font-weight: 700; color: #000">意见:</td>
                            <td colspan="3">
                                <div style="display: flex; justify-content: space-between">
                                    <div style="width: 48%">
                                        <el-input type="textarea" :autosize="{ minRows: 5 }" placeholder="请输入内容" v-model="form.clyj">
                                        </el-input>
                                    </div>
                                    <div class="xzyj">
                                        <div
                                            v-for="(item, index) in yjlistht"
                                            :key="index"
                                            class="xzyjitem"
                                            :style="yjdeepcolor == index ? 'background-color:#CECECE;' : ''"
                                            @click="getYjVal(item, index)"
                                        >
                                            {{ item }}
                                        </div>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        <tr style="background-color: #f5fafa">
                            <td colspan="4">
                                <el-button size="mini" type="primary" @click="nextstepht" :disabled="isSubmit">回退</el-button>
                                <el-button size="mini" @click="cacelsubmitForm('ruleForm')">返回</el-button>
                            </td>
                        </tr>
                    </table>
                </el-tab-pane>
            </el-tabs>
        </div>
    </div>
</template>
<script>
import { gdalldetails, signlistadd, gdlccheck, dbnum, caselist } from '@/api/index';
import global from '@/components/common/httpurl.vue';
export default {
    name: 'htqdadd',
    data() {
        return {
            isSubmit: false,
            monthlist: [
                { label: '1月', value: '01' },
                { label: '2月', value: '02' },
                { label: '3月', value: '03' },
                { label: '4月', value: '04' },
                { label: '5月', value: '05' },
                { label: '6月', value: '06' },
                { label: '7月', value: '07' },
                { label: '8月', value: '08' },
                { label: '9月', value: '09' },
                { label: '10月', value: '10' },
                { label: '11月', value: '11' },
                { label: '12月', value: '12' }
            ],
            userlistht: [],
            detailform: {},
            activeName: 'first',
            options: [], //测试
            yjlist: ['同意', '同意，请认真办理！', '拟同意，请领导批示！', '请办公室盖章！', '已盖章', '已办理，请归档！'],
            role: this.$store.getters.role,
            yjlistld: [
                '拟同意，请智宗同志阅示！',
                '同意',
                '同意，请认真办理！',
                '拟同意，请领导批示！',
                '请办公室盖章！',
                '已盖章',
                '已办理，请归档！'
            ],
            yjlistnq: [
                '已归档',
                '请盖章',
                '同意',
                '同意，请认真办理！',
                '拟同意，请领导批示！',
                '请办公室盖章！',
                '已盖章',
                '已办理，请归档！'
            ],
            yjlistht: ['不同意', '不同意，请认真复核！'],
            yjdeepcolor: null,
            getsubmit: true,
            httpUrl: global.httpUrl, //公共地址
            filefileList: [], //文件列表
            fileListshandle: [],
            // 请求表头信息
            myHeaders: {
                token: localStorage.getItem('token')
            },
            fileList: [],
            tableData: [], //可编辑表格
            projectdetail: {}, //楼幢详情
            sbqd: [], //设备清单
            form: {
                clyj: '', //处理意见
                nextnodeid: '', //选择下一步节点id
                selectuser: '', //下一步选择用户id
                zt: '1',
                processtableInfo: {}, //流程表单信息 ,
                zjinfoList: [] //租金列表信息
            },
            // 开始时间限制到今年之后
            pickerOptionstart: {
                disabledDate(time) {
                    var year = new Date().getFullYear() - 1;
                    // console.log(year)
                    // console.log(time.getTime())
                    return time.getTime() < new Date(year + '-12-31').getTime();
                }
            },
            // 结束时间比开始时间大
            pickerOptionend: {},
            userlist: [],
            filetable: [], //文件列表
            fileform: {
                caseid: '',
                pageSize: 100,
                current: 1
            },
            yjhttableData: []
        };
    },
    methods: {
        // 时间转换
        stringDateToTimestamp(stringDate) {
            return Date.parse(new Date(stringDate));
        },
        // 获取终止日期
        pickDateEnd() {
            let idStartDate = this.form.qdsj;
            if (!idStartDate) return;
            let that = this;
            that.pickerOptionend = {
                disabledDate(time) {
                    return time.getTime() <= that.stringDateToTimestamp(idStartDate);
                }
            };
        },
        // 创建
        submitForm() {
            this.form.processtableInfo.sbqd = this.sbqd.toString();
            this.form.zjList = this.tableData;
            console.log(this.form);
            signlistadd(this.form).then((res) => {
                if (res.code == 200) {
                    this.$message.success('创建成功');
                    this.$router.go(-1);
                } else {
                    this.$message.error('创建失败');
                }
            });

            console.log('提交确定');
        },
        // 取消
        cacelsubmitForm() {
            this.$router.go(-1);
        },
        // 文件
        handleRemoves(file, fileList, filetype) {
            console.log(fileList);
            console.log('filetype', filetype);
            this.fileListshandle = fileList.map((res) => {
                return res.response.data.id;
            });
            this.form.processtableInfo[filetype] = this.fileListshandle.toString();
        },
        // 文件删除前
        beforeRemoves(file, fileList) {
            console.log(file);
            console.log(fileList);
            return this.$confirm(`确定移除 ${file.name}？`);
        },
        // 上传成功
        handelfilesuccess(response, file, fileLists, filetype) {
            console.log(fileLists);
            console.log('filetype', filetype);
            this.$message.success('导入成功');
            this.fileListshandle = fileLists.map((res) => {
                console.log(res.response.data);
                return res.response.data.id;
            });
            this.form.processtableInfo[filetype] = this.fileListshandle.toString();
        },
        // 月份划分(列表数据计算)
        gettime(start, end, htje, sjjmje) {
            let ranges = [];
            let qsrq = start.split(' ')[0];
            let zzrq = end.split(' ')[0];
            console.log(qsrq);
            console.log(zzrq);
            let [i, j] = [qsrq, zzrq].map((i) => new Date(i)).sort((a, b) => a - b);
            console.log([i, j]);
            while (i <= j) {
                const status_code = '1';
                const jfrq = i.toISOString().slice(0, 10); //开始日期
                const year = jfrq.split('-')[0]; //应收年份
                const month = jfrq.split('-')[1]; //应收年月
                i = new Date(i.getFullYear(), i.getMonth() + 1, 0, i.getHours());
                const jmje = sjjmje; //减免金额
                const yyjje = 0; //月应收金额
                const yjje = 0;
                const jkje = 0;
                i.setDate(i.getDate() + 1);
                ranges.push({ year, month, jfrq, yyjje, jmje, status_code, yjje, jkje });
            }
            this.tableData = ranges;
            let aaa = this.average(htje, this.tableData.length, 2);
            this.tableData.map((item, index) => {
                item.yyjje = aaa[index];
            });
            console.log(this.tableData);
        },
        // 平均计算方法(最后一位补齐余数)
        average(value, amount, point) {
            if (!point) {
                point = 0;
            }
            let list = [];
            let first = (Math.floor((value / amount) * Math.pow(10, point)) / Math.pow(10, point)).toFixed(point);
            let last = (value - first * (amount - 1)).toFixed(point);
            for (let i = 0; i < amount - 1; i++) {
                list.push(first);
            }
            list.push(last);
            console.log('list', list);
            return list;
        },
        // 合并计算某一列
        getSummaries(param) {
            const { columns, data } = param;
            const sums = [];
            columns.forEach((column, index) => {
                if (index === 0) {
                    sums[index] = '合计';
                    return;
                }
                const values = data.map((item) => Number(item[column.property]));
                // 只对amount这一列进行总计核算。
                if (column.property === 'yyjje') {
                    // sums[index] = '---'
                    if (!values.every((value) => isNaN(value))) {
                        sums[index] = values.reduce((prev, curr) => {
                            const value = Number(curr);
                            if (!isNaN(value)) {
                                return prev + curr;
                            } else {
                                return prev;
                            }
                        }, 0);
                        sums[index] += '';
                    } else {
                        sums[index] = '---';
                    }
                    console.log('yyjje', sums[index]);
                    sums[index] = Number(sums[index]).toFixed(2);
                } else {
                    sums[index] = '---';
                }
                if (column.property === 'yjje') {
                    if (!values.every((value) => isNaN(value))) {
                        console.log('应缴金额', values);
                        sums[index] = values.reduce((prev, curr) => {
                            const value = Number(curr);
                            if (!isNaN(value)) {
                                return prev + curr;
                            } else {
                                return prev;
                            }
                        }, 0);
                        sums[index] += '';
                    }
                    sums[index] = Number(sums[index]).toFixed(2);
                }
            });
            console.log('tableData', this.tableData);
            console.log('sums', sums);
            this.form.nzj = sums[4];
            return sums;
        },
        // 归档详情
        gdalldetails(data) {
            gdalldetails(data).then((res) => {
                console.log(res.data);
                var that = this;
                this.detailform = res.data; //全部数据
                if (res.data.ishq == 0) {
                    if (res.data.nextnodelist.length != 0) {
                        that.form.nextnodeid = res.data.nextnodelist[0].id;
                        that.userlist = res.data.nextnodelist[0].userlist;
                        that.form.selectuser = that.userlist[0].id;
                    }
                }
                this.projectdetail = res.data.processtableInfo; //已录入数据
                this.yjhttableData = this.projectdetail.cgsqdwj;
                this.form.id = res.data.id;
                this.fileform.caseid = res.data.caseid;
                this.caselist(this.fileform);
            });
        },
        // 流程文件列表
        caselist(data) {
            caselist(data).then((res) => {
                this.filetable = res.data;
                console.log('filelist', res);
            });
        },
        // 获取到每一个意见值
        getYjVal(val, i) {
            this.yjdeepcolor = i;
            console.log(val);
            this.form.clyj = val;
        },
        // 下一步操作按钮
        nextstep() {
            var that = this;
            console.log('表格', this.tableData);
            console.log(this.form);
            this.$confirm('确定通过审批？')
                .then(() => {
                    if (this.detailform.isstartend == 1) {
                        this.form.processtableInfo = this.projectdetail;
                        this.form.zjinfoList = this.tableData;
                        this.form.processtableInfo.sbqd = this.sbqd.toString();
                    }
                    // 先判断是否会签（会签不用选人员）
                    if (this.detailform.ishq == 0) {
                        // 判断是否是最后一个节点（最后一个节点不用选人员）
                        if (that.detailform.isstartend == 2) {
                            that.isSubmit = true;
                            that.gdlccheck(that.form);
                        } else {
                            if (that.form.selectuser) {
                                console.log(that.form);
                                that.isSubmit = true;
                                that.gdlccheck(that.form);
                            } else {
                                that.$message.error('请选择人员！！！');
                            }
                        }
                    } else {
                        if (this.options.length != 0) {
                            this.form.nextnodeid = this.options.toString();
                            this.isSubmit = true;
                            this.gdlccheck(this.form);
                            console.log(this.form);
                        } else {
                            this.$message.error('请选择！！');
                        }
                    }
                })
                .catch(() => {
                    this.$message.success('通过取消');
                });
        },
        // 下一步回退
        nextstepht() {
            this.form.zt = 0;
            this.$confirm('确定回退审批？')
                .then(() => {
                    if (this.form.selectuser) {
                        this.isSubmit = true;
                        this.gdlccheck(this.form);
                    } else {
                        this.$message.error('请选择人员！！！');
                    }
                })
                .catch(() => {
                    this.$message.success('回退取消');
                });
        },
        // 选项卡
        handleClick() {
            var that = this;
            if (this.activeName == 'first') {
                if (this.detailform.ishq == 0) {
                    if (that.detailform.nextnodelist.length != 0) {
                        that.form.nextnodeid = that.detailform.nextnodelist[0].id;
                        that.userlist = that.detailform.nextnodelist[0].userlist;
                        that.form.selectuser = that.userlist[0].id;
                    }
                }
            } else if (this.activeName == 'second') {
                this.form.nextnodeid = this.detailform.lastnodelist[0].id;
                this.userlistht = this.detailform.lastnodelist[0].userlist;
                this.form.selectuser = this.userlistht[0].id;
            }
        },
        // 列表新增一条数据
        addnewtable() {
            let newrow = {
                jfrq: '',
                jkje: 0,
                jmje: 0,
                month: '',
                year: '',
                yjje: 0,
                yyjje: 0,
                status_code: '1'
            };
            this.tableData.push(newrow);
        },
        // 删除表格某一行数据
        deleteRow(index, rows) {
            rows.splice(index, 1);
        },
        // 获取月份
        getmonths(e) {
            console.log('获取月份', e);
            e.jfrq = e.year + '-' + e.month + '-01';
        },
        // 点击获取人员列表
        getry(val) {
            this.userlist = val.userlist;
        },
        // 点击获取人员列表(回退)
        getryht(val) {
            console.log(val);
            this.userlistht = val.userlist;
        },
        // 流程审批
        gdlccheck(data) {
            gdlccheck(data).then((res) => {
                if (res.code == 200) {
                    this.$message.success('审批通过');
                    let userid = this.$store.getters.userId;
                    this.dbnum(userid);
                    this.isSubmit = false;
                    this.$router.go(-1);
                }
            });
        },
        // 待办数据
        dbnum(data) {
            dbnum(data).then((res) => {
                console.log('待办', res);
                this.$store.commit('handledbnum1', res.data.swnum);
                this.$store.commit('handledbnum2', res.data.gdnum);
                this.$store.commit('handledbnum4', res.data.wtswnum);
            });
        }
    },

    created() {
        this.form.relid = this.$route.params.id;
        console.log(this.$route.params);
        let data = {
            id: this.$route.params.id
        };
        this.gdalldetails(data);
    }
};
</script>
<style>
/* disabled颜色修改 */
.el-checkbox__input.is-disabled + .el-checkbox__label {
    color: #606266 !important;
}

.el-checkbox__input.is-disabled.is-checked + .el-checkbox__label {
    color: #606266 !important;
}

.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner:after {
    border-color: #606266 !important;
}

.el-radio__input.is-disabled + span.el-radio__label {
    color: #606266 !important;
}

.el-radio__input.is-disabled.is-checked .el-radio__inner::after {
    background-color: #606266 !important;
}

.el-radio__input.is-disabled .el-radio__inner,
.el-radio__input.is-disabled.is-checked .el-radio__inner {
    border-color: #606266 !important;
}

.el-input.is-disabled .el-input__inner,
textarea:disabled {
    color: #606266 !important;
}

.el-range-editor.is-disabled input {
    color: #606266 !important;
}

/* 选择意见 */
.xzyj {
    width: 48%;
    height: 110px;
    overflow-y: scroll;
    overflow-x: hidden;
    border: 1px solid #dcdfe6;
    border-radius: 4px;
    padding: 10px 0;
    box-sizing: border-box;
}

.xzyj .xzyjitem {
    text-align: left;
    cursor: pointer;
    line-height: 24px;
}

.el-upload-list {
    width: 60%;
}

.el-upload--text {
    width: auto;
    height: 80px;
    overflow: hidden;
    border: none;
}
</style>
<style scoped>
.container {
    overflow: hidden;
}

.crumbs {
    background-color: #fff;
    padding: 20px 20px;
}

.indexTitle {
    margin-bottom: 20px;
}

.contentbox {
    display: flex;
    justify-content: space-between;
}

.contentsize {
    font-size: 18px;
    font-weight: 700;
    line-height: 32px;
    color: #606266;
}

.handle-box {
    overflow: hidden;
}

.addtitle {
    width: 100%;
    border-bottom: 1px solid #eeeeee;
    padding-bottom: 20px;
    box-sizing: border-box;
    margin-bottom: 20px;
    font-weight: 700;
}

.buttonCenter {
    width: 12%;
    margin: auto;
}

.unloadTitle {
    text-align: left;
    padding-bottom: 10px;
    box-sizing: border-box;
    color: #606266;
}

/* 搜索按钮 */
.searchcolor {
    background-color: #7090ff;
}

.detailcontent {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.detailcontent .detailitem {
    /* float: left; */
    width: 33%;
    margin-bottom: 30px;
}

.detailcontent .detailitem1 {
    /* float: left; */
    width: 99%;
    margin-bottom: 30px;
    font-weight: 700;
    color: #008a94;
}

table {
    width: 100%;
    margin: auto;
    text-align: center;
}

.table-1 {
    border: 1px solid #c0c0c0;
    border-collapse: collapse;
    /*合并相邻表格的间距*/
}

.table-1 tr,
.table-1 td {
    font-size: 13px;
    border-collapse: collapse;
    border: 1px solid #c0c0c0;
    padding: 10px;
    box-sizing: border-box;
    color: #606266;
}
</style>